<template>
    <div class="app-container">
        <el-form inline size="small" ref="queryForm" :model="queryParams" v-show="showSearch" label-width="100px">
            <el-form-item label="用户名称" prop="nickName">
                <el-input style="width:215px;" v-model="queryParams.nickName"></el-input>
            </el-form-item>
            <el-form-item>
                <el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery">搜索</el-button>
                <el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button>
            </el-form-item>
        </el-form>
        <el-table :data="list">
            <!-- <el-table-column label="用户id" prop="userId"></el-table-column> -->
            <el-table-column label="所属部门" prop="deptName"></el-table-column>
            <el-table-column label="用户角色" prop="roleName"></el-table-column>
            <el-table-column label="用户姓名" prop="nickName"></el-table-column>
            <el-table-column label="手机号" prop="phone"></el-table-column>
            <el-table-column label="当前订单数" prop="orderNumber"></el-table-column>
            <el-table-column label="操作">
                <template slot-scope="{row}">
                    <el-button type="text" @click="handle(row)" v-hasPermi="['order:orderBasic:distribution']">订单分配</el-button>
                </template>
            </el-table-column>
        </el-table>
        <pagination v-show="total>0" :total="total" :page.sync="queryParams.pageNum" :limit.sync="queryParams.pageSize" @pagination="getList" />
    </div>
</template>

<script>
import * as api from '@/api/longOrder/basic'

export default {
    props: ['orderNo'],
    data() {
        return {
            list: [],
            // 总条数
            total: 0,
            // 显示搜索条件
            showSearch: true,
            queryParams: {
              orderNo:this.orderNo,
                nickName: "",//车牌号
                pageNum: 0,//页码   必选
                pageSize: 10,//每页显示数据 必选
            },
        };
    },
    mounted() {
        this.getList();
    },
    methods: {
        getList() {
            api.geUserlist(this.queryParams).then(response => {
                this.list = response.rows;
            });
        },
        // 确定配车
        handle(row) {
            const data = {
                orderNo: this.orderNo,
                userId: row.userId,
                nickName: row.nickName,
            };
            api.distribution(data).then(response => {
                this.$modal.msgSuccess("操作成功");
                this.$emit('close');
            });
        },
        /** 搜索按钮操作 */
        handleQuery() {
            this.pageNum = 1;
            this.getList();
        },
        /** 重置按钮操作 */
        resetQuery() {
            this.resetForm("queryForm");
            this.handleQuery();
        },
    },
}
</script>
